<template>
  <div>
    <div class="m11br">
      <h3>网点服务</h3>
      <img src="../assets/img/错号.png" alt="">
    </div>

    <!-- 附近网点 -->
    <div class="m11br1">
      <!-- 地点 -->
      <div class="m11site">
  
        <p class="m11site1">附近网点 <span class="m11a">距您{{ (v.distance || vsnew.B) |mii }}千米</span></p>
        <router-link to="Condition">
          <p class="m11site2">网点查询</p>
        </router-link>
        <!-- 位置 -->
        <div class="m11place" id="m11place">
       
          <p>{{ (v.address || vsnew.A)     |message}} <span class="m11ww">营业中</span></p>
          <img src="../assets/img/地点，定位.png" alt=""> <span class="m11zz">{{ v.data || vsnew.C }}</span>
        </div>
      </div>
      <!-- 等待 -->
      <div class="m11qqq">
        <p class="m11dengd">等待人数</p>
        <div class="mm1peo">
          <div class="m11peoe">
            <p>1</p>
            <p>个人业务</p>
          </div>
          <div class="m11peoe">
            <p>0</p>
            <p>对公业务</p>
          </div>
        </div>
        <div class="m11num">
          <p>取号</p>
        </div>
      </div>
    </div>
    <!-- 取号记录 -->
    <div class="m11record">
      <p>取号记录 </p>
      <p>|</p>
      <p>预约记录</p>
    </div>
    <!-- 预约办理 -->
    <div class="m11manage">
      <h4>预约办理</h4>
      <div class="m11man1">
        <div class="m11man2">
          <img src="../assets/img/银行卡管理1.png" alt="">
          <span>开卡预填单</span>
        </div>
        <div class="m11man2">
          <img src="../assets/img/信用卡还款.png" alt="">
          <span>大额提现</span>
        </div>
        <div class="m11man2">
          <img src="../assets/img/转账.png" alt="">
          <span>外币取现</span>
        </div>
        <div class="m11man2">
          <img src="../assets/img/借记卡换卡-蓝.png" alt="">
          <span>贷款预约</span>
        </div>
        <div class="m11man2">
          <img src="../assets/img/金币 (1).png" alt="">
          <span>纪念币预约</span>
        </div>
        <div class="m11man2">
          <img src="../assets/img/银行卡管理1.png" alt="">
          <span>同号换卡</span>
        </div>
      </div>


      <!-- 优选服务 -->
      <h4>优选服务</h4>
      <div class="m11man1">
        <div class="m11man2">
          <img src="../assets/img/银行卡管理1.png" alt="">
          <span>信用卡申请</span>
        </div>
        <div class="m11man2">
          <img src="../assets/img/借款明细查询.png" alt="">
          <span>开通电子账户</span>
        </div>
        <div class="m11man2">
          <img src="../assets/img/33.png" alt="">
          <span>无卡取款</span>
        </div>
        <div class="m11man2">
          <img src="../assets/img/汇总审批.png" alt="">
          <span>存款证明</span>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
import { bran } from "../api/Branch"
export default {


  data() {
    return {
      v: {},
      vsnew: {}
    }

  },
  created() {
    this.zhifu1()
  },
  filters:{
    message(val){
      if(val.length<=11){
      return val
   }
    return val.slice(0,11)+"···"
    },
    mii(val){
      if(val.length<=4){
      return val
   }
    return val.slice(0,4)
    }
  },
  methods: {
    zhifu1() {
      let b = { location: "37.877346,112.568001" }
      bran(b).then((res) => {
        if (res.code == 200) {
          console.log(res.data);
          let tt = this.$route.params;
          console.log(typeof (tt.A) != "undefined");
          if (tt.A == undefined) {
            this.v = res.data
          } else {
            this.vsnew = tt
            console.log(this.vsnew);
            console.log(this.v);
          }
        }
      }).catch((err) => {
        console.log(err);
      })
    },
  },



}
</script>

<style scoped src="../assets/css/branch.css"></style>